<template>
	<view>


		<view class="contenter">
			<view v-if="noData == false">
				<view v-for="(item,index) in visits" :key="index"
					class="bg-white margin-top visit_conter visit_border padding"
					@click="_showDetail(item)">
					<view class="flex padding-bottom-xs solid-bottom justify-between">
						<view>预约状态</view>
						<view class="text-gray">{{item.recordState == 1 ? '已失效' : '已生效'}}</view>
					</view>
					<view class="flex margin-top justify-between">
						<view class="text-gray">访客姓名</view>
						<view class="text-gray">{{item.vName}}</view>
					</view>

					<view class="flex margin-top-xs justify-between" v-if="item.carNum">
						<view class="text-gray">车牌号</view>
						<view class="text-gray">{{item.carNum}}</view>
					</view>
					<view class="flex margin-top-xs justify-between" v-if="item.carNum">
						<view class="text-gray">车辆审核状态</view>
						<view class="text-gray">{{item.stateName}}</view>
					</view>
					<view class="flex margin-top-xs justify-between">
						<view class="text-gray">预计来访时间</view>
						<view class="text-gray">{{item.visitTime}}</view>
					</view>

				</view>
				<uni-load-more :status="loadingStatus" :content-text="loadingContentText" />
			</view>
			<view v-else>
				<no-data-page></no-data-page>
			</view>
		</view>

		<view class="block__title">
			<button class="cu-btn" type="primary" @click="_addVisit()">新增预约</button>
		</view>

	</view>
</template>

<script>
	import context from '../../lib/java110/Java110Context.js';
	import {
		listOwnerVisit
	} from '../../api/visit/visit.js'
	import noDataPage from '@/components/no-data-page/no-data-page.vue'
	import uniLoadMore from '@/components/uni-load-more/uni-load-more.vue';

	export default {
		data() {
			return {
				noData: false,
				visits: [],
				ownerInfo: {},
			}
		},
		components: {
			noDataPage,
			uniLoadMore
		},

		/**
		 * 生命周期函数--监听页面加载
		 */
		onLoad: function(options) {
			context.onLoad(options);
			this.visited()
		},
		// onReachBottom: function() {
		// 	if (this.loadingStatus == 'noMore') {
		// 		return;
		// 	}
		// 	this._loadVisitList();
		// },
		methods: {
			visited() {
				let _that = this;
				uni.request({
					url: "http://localhost:8888/visits",
					// url: constant.url.queryFloor,
					header: context.getHeaders(),
					method: "GET",
					//动态数据
					success: function(res) {

						if (res.statusCode == 200) {
							let visits = res.data;
							_that.visits = visits;
							if (_that.visits.length < 1) {
								_that.noData = true;
							}
							if (_that.visits.length == _visits.total) {
								_that.loadingStatus = 'noMore';
								return;
							}
						}
					},
					fail: function(e) {
						wx.showToast({
							title: "服务器异常了",
							icon: 'none',
							duration: 2000
						});
					}
				});
			},
			_addVisit: function() {
				uni.navigateTo({
					url: '/pages/visit/addVisit'
				})
			},
			// _loadVisitList: function() {
			// 	this.loadingStatus = 'more';
			// 	let _that = this;
			// 	let _objData = {
			// 		page: _that.page,
			// 		row: 10,
			// 		ownerId: this.ownerInfo.ownerId,
			// 		userId: this.ownerInfo.userId,
			// 		communityId: this.ownerInfo.communityId
			// 	}
			// 	listOwnerVisit(_objData).then(function(_visits){
			// 		_that.visits = _that.visits.concat(_visits.visits);
			// 		_that.page ++;

			// 		if (_that.visits.length < 1) {
			// 			_that.noData = true;
			// 		}
			// 		if(_that.visits.length == _visits.total){
			// 			_that.loadingStatus = 'noMore';
			// 			return;
			// 		}
			// 	})
			// },

			_showDetail(_item) {
				uni.navigateTo({
					url: '/pages/visit/visitDetail?vId=' + _item.vId
				})
			}
		}
	}
</script>

<style scoped lang="scss">
	.contenter {
		width: 100%;
		height: calc(100vh - 130rpx);
		overflow: auto;
	}

	.solid-bottom::after {
		border-bottom: 2upx solid rgba(0, 0, 0, 0.1);
	}

	.ppf_item {
		padding: 0rpx 0rpx 0rpx 0rpx;
	}

	.block__title {
		width: 100%;
		height: 130rpx;
		position: relative;
		bottom: 0rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		font-weight: 400;
		font-size: 14px;
		color: rgba(69, 90, 100, 0.6);
		padding: 40rpx 30rpx 20rpx;

		button {
			width: 400rpx;
			height: 80rpx;
			border-radius: 40rpx;
			text-align: center;
			line-height: 80rpx;
		}
	}

	.button_up_blank {
		height: 40rpx;
	}

	.block__bottom {
		height: 180rpx;
	}
</style>
